Mobile: Fixes #11028: Accessibility: Fix sidebar broken in right-to-left mode, improve screen reader accessibility #11056
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
personalizedrefrigerator
added
mobile
| @@ -11,7 +11,6 @@ export const DEFAULT_ROUTE = { | |||
| const appDefaultState: AppState = { | |||
| smartFilterId: undefined, | |||
| ...defaultState, | |||
| sideMenuOpenPercent: 0, | |||
There was a problem hiding this comment.
The sideMenuOpenPercent state was previously unused (only usage commented out).
Comment on lines
-603
to
+592
| // Accessibility, keyboard, and touch hidden. | ||
| inert={isHidden} | ||
| refocusCounter={isHidden ? undefined : 1} | ||
| > | ||
| <View style={style}> |
There was a problem hiding this comment.
The "hide for accessibility" and autofocus logic is now handled by SideMenu.tsx, so this workaround is no longer necessary.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Summary
This pull request replaces the unmaintained
react-native-side-menu-updatedwith a customSideMenuwith a similar implementation: Both use React Native'sAniamtedandPanResponder.This fixes several issues:
Additionally, it fixes a recent iOS regression:
It should also make the sidebar better at detecting fast open/close gestures.
Resolves #11028.
Resolves #8999.
Screen recordings
Web/Firefox
Screencast.from.2024-09-15.14-16-00.webm
Android 13
No TalkBack:
out.mp4
With TalkBack:
out.mp4
iOS 17 (simulator)
Simulator.Screen.Recording.-.iPhone.15.Pro.-.2024-09-15.at.14.22.00.mp4
iOS (simulator, reduce motion)
after-pr-ios-ltr-portrait-reduce-motion.mp4
iOS (simulator, right-to-left layout)
Portrait:
after-pr-ios-rtl-portrait.mp4
Landscape:
after-pr-rtl-landscape.mp4
Observe that there are still issues in landscape mode on iOS devices with a notch — the sidemenu can be partially covered by the notch. This, however, seems better than before (see recordings under "Compare with before").
Compare with before
pre-pull-request--ios-rtl.mp4
before-pr-ios-rtl-portrait.mp4
iOS (simulator, VoiceOver enabled)
after-pr-ios-voiceover.mp4